<template>
	<div class="content">
		<template v-if="this.$route.path == '/content'">
			<div class="aroundOf">课件列表</div>
			<div class="courseware_list">
				<!-- 搜索组件 -->
				<div class="above">
          <div class="container">
            <div class="row">
              <div class="col col-xxl-8 col-xl-12 col-lg-8 col-md-12">
                <div class="three_left">
                  <search-input @searchOn="onSearch" @clearChange="clearChange"></search-input>
                  <selector :options="options" @classification="classification"></selector>
                  <discipline :discipline="discipline" @nChange="nChange" v-if="huoQu.xiaLa == '理化生实验'"></discipline>
                  <grade :grade="grade" @jChange="jChange" v-if="huoQu.xiaLa == '理化生实验' || huoQu.xiaLa == '数学几何' "></grade>
                  <campus :discipline="discEs" @nChangeSe="nChangeSe" v-if="huoQu.xiaLa == '校园安全'"></campus>
                  <humanities :discipline="discRs" @nChangeRe="nChangeReSr" v-if="huoQu.xiaLa == '人文地理'"></humanities>
                  <allState :allState="allState" @onWrite="onWrite" style="margin-right: 10px;"></allState>
                  <el-date-picker
                    type="date"
                    clearable
                    @change="changePickerDay"
                    :picker-options="setMonthDisableds"
                    v-model="pickerDay"
                    placeholder="选择查询时间">
                  </el-date-picker>
                </div>
              </div>
              <div class="col col-xxl-4 col-xl-12 col-lg-4 col-md-12">
                <div class="fore_right">
                  <el-button @click="operations('add')">新增</el-button>
                  <el-button @click="operations('shelves')" :disabled="SelectionList.length == 0 || theRadio.status == 1 || isShowDisabledUp">上架</el-button>
                  <el-button @click="operations('xShelves')" :disabled="SelectionList.length == 0 || theRadio.status == 2 || isShowDisabledDown">下架</el-button>
                  <el-button @click="theSorting">排序</el-button>
                  <el-button @click="operations('delete')" :disabled="SelectionList.length == 0">删除</el-button>
                </div>
              </div>
            </div>
          </div>
				</div>

				<div class="formTable">
					<contentSe :isDisabled="isDisabled" :numBer="SelectionList.length" :formData="formData" @operation="operation" @handleSelectionChange="handleSelectionChange" @selectChange="selectChange"></contentSe>
          <!--  v-if="formData.length >= 20"  当数据大于20条时显示分页@imgTopBig="imgTopBig" -->
					<paging :currentPage3="currentPage3" :total="total" :pageSize="pageSize" @handleSizeChange="handleSizeChange" @handleCurrentChange="handleCurrentChange"></paging>
				</div>

        <!-- 排序弹框 -->
        <a-modal v-model="visible" title="课件排序" on-ok="handleOk" style="text-align: center;" :maskClosable="false" :closable="false" :keyboard="false">
          <template slot="footer" style="text-align: center;">
            <a-button key="submit" type="primary" :loading="loading" @click="handleOk"> 保存 </a-button>
            <a-button key="back" @click="handleCancel" :disabled="chooseEsAt.cancelBtn"> 取消 </a-button>
          </template>
          <div>  
            <a-radio-group v-model="chooseEsAt.radioGroup" @change="onChange">
              <a-radio v-for="item in options" :key="item.value" :value="item.value"> {{ item.label }} </a-radio>
            </a-radio-group>
          </div>
          <div v-if="chooseEsAt.radioGroup == '理化生实验'">
            <a-radio-group v-model="chooseEsAt.disciplineSe" @change="disciplineSe">
              <a-radio v-for="item in discipline" :key="item.value" :value="item.value"> {{ item.label }} </a-radio>
            </a-radio-group>
          </div>
          <div v-else-if="chooseEsAt.radioGroup == '数学几何'">
            <a-radio-group v-model="chooseEsAt.mathematics" @change="disciplineSe">
              <a-radio v-for="item in mathematics" :key="item.value" :value="item.value"> {{ item.label }} </a-radio>
            </a-radio-group>
          </div>
          <div v-else-if="chooseEsAt.radioGroup == '心理健康'" style="height: 26px;"></div>
          <div v-else-if="chooseEsAt.radioGroup == '校园安全'">
            <a-radio-group v-model="chooseEsAt.security" @change="disciplineSe">
              <a-radio v-for="item in discEs" :key="item.value" :value="item.value"> {{ item.label }} </a-radio>
            </a-radio-group>
          </div>
          <div v-else-if="chooseEsAt.radioGroup == '人文地理'">
            <a-radio-group v-model="chooseEsAt.geographic" @change="disciplineSe">
              <a-radio v-for="item in discRs" :key="item.value" :value="item.value"> {{ item.label }} </a-radio>
            </a-radio-group>
          </div>

          <div style="text-align: left;margin: 10px 0;color: #aaa;">共{{ myArray.length }}条数据,仅支持已上架的课件进行排序</div>
          
          <table>
            <tr style="background: #f2f2f2;height: 40px;line-height: 40px; display: flex;justify-content: space-between;">
              <td style="width: 8%;">排序</td>
              <td style="width: 32%;text-align: left;margin-left: 20px;">课件名称</td>
              <td style="width: 14.5%;">学科</td>
              <td style="width: 14.5%;">年级</td>
              <td style="width: 14.5%;">创建时间</td>
              <td style="width: 14.5%;"></td>
            </tr>
            <draggable v-model="myArray" force-fallback="true" group="people" animation="1000" @start="onStart" @end.stop="onEnd" chosenClass="chosen" handle=".away">  <!-- handle指定拖拽的元素才能进行拖拽 -->
              <tr v-for="(item,index) in myArray" :key="item.id" @mouseover="mouseover(item.id)" style="cursor: move;" class="move">
                <td style="width: 70px;line-height: 42px;text-align: center;" @dblclick="dblclick(item.id)" @click.stop>
                  <el-input size="mini" style="width: 88%;" v-model="item.sort" @blur="blurChangeDb(item.sort, index)" v-if="chooseEsAt.currentId.includes(item)">{{ item.sort }}</el-input>
                  <el-tooltip class="item itemHove" effect="dark" content="双击快捷排序" placement="left-start" v-else style="margin: 0;padding: 15px 25px;border: 0;background-color: transparent;">
                    <el-button type="text">{{ item.sort }}</el-button>
                  </el-tooltip>
                </td>
                <td style="width: 300px;line-height: 42px;text-align: left;">
                  <img :src="item.img" style="width: 45px;height: 35px;margin: 0 15px 0 25px;">
                  {{ item.name == '' ? '--' : item.name }}
                </td>
                <td style="width: 135.5px;line-height: 42px;text-align: center;">{{ item.subject == '' ? '--' : item.subject }}</td>
                <td style="width: 135.5px;line-height: 42px;text-align: center;">{{ item.clas == '' ? '--' : item.clas }}</td>
                <td style="width: 135.5px;line-height: 42px;text-align: center;">{{ item.createDate == '' ? '--' : item.createDate }}</td>
                <td style="width: 135.5px;line-height: 42px;text-align: center;cursor: move;">
                  <div style="width: 100%;height: 100%;" class="away">
                    <span v-if="chooseEsAt.currentIds.includes(item)">拖动此处进行排序 <i class="el-icon-rank"></i></span>
                  </div>
                </td>
              </tr>
              <tr v-if="myArray.length == 0">
                <td style="width: 912px;line-height: 42px;text-align: center;"> 暂无数据 </td>
              </tr>
            </draggable> 
          </table>
        </a-modal>

        <!-- 这个是图片放大效果 -->
        <!-- <div class="demo-image__preview">  
          <el-image 
            style="width: 100px; height: 100px"
            :src="url" 
            :preview-src-list="srcList">
          </el-image>
        </div> -->
			</div>
		</template>
		
		<transition name="transitionName">
			<router-view clss="index-main" />
		</transition>
		
	</div>
</template>

<script>
import draggable from "vuedraggable";  // 拖拽插件
import searchInput from '@/components/search/search.vue';
import selector from '../../components/selector/selector.vue';
import discipline from '../../components/selector/discipline.vue';
import grade from '../../components/selector/grade.vue';
import allState from '../../components/selector/allState.vue';
import contentSe from '../../components/content/contentSe.vue';
import paging from '../../components/content/paging.vue';
import campus from '../../components/content/campus.vue';
import humanities from '../../components/content/humanities.vue';
import { timestampToTimeShi, timestampToTime, } from '../../utils/util';
export default {
  components: { searchInput , selector , discipline, grade , allState, contentSe , paging, campus, humanities, draggable },
	data() {
		return {
      options: [{ value: '理化生实验', label: '理化生实验' },{ value: '数学几何', label: '数学几何' },{value: '心理健康',label: '心理健康'},{value: '校园安全',label: '校园安全'},{value: '人文地理',label: '人文地理'}],
			discipline: [{ value: '物理', label: '物理' },{ value: '化学', label: '化学' },{value: '生物',label: '生物'}],
			grade: [ { value: '初一上', label: '初一上' },{ value: '初一下', label: '初一下' },{ value: '初二上', label: '初二上' },{ value: '初二下', label: '初二下' },{ value: '初三上', label: '初三上' },{ value: '初三下', label: '初三下' }],
			allState: [ { value: '已上架', label: '已上架' },{ value: '已下架', label: '已下架' },{ value: '未上架', label: '未上架' } ],
      discEs: [{value: '地震逃生', label: '地震逃生'},{ value: '消防演习', label: '消防演习' },{ value: '洪涝灾害', label: '洪涝灾害' },{ value: '急救知识', label: '急救知识' },{ value: '反诈模拟', label: '反诈模拟' }],
      discRs: [{value: '大美华夏', label: '大美华夏'},{value: '疆外风光', label: '疆外风光'},{value: '自然奇观', label: '自然奇观'}],
      mathematics: [{value: '数学',label: '数学' }], // 排序弹窗中的数学二级菜单
			formData: [],      // 列表数据
			currentPage3: 0,   // 那一页
			total: 0,          // 总条数
			pageSize: 20,      // 每页显示多少条
      SelectionList: [], // 表格选择框选中的数组
      time: null,        // 搜索防抖
      row: {
        id: 0,  //单选过来选中的id
        status: 1,
      },
      newId: [],
      huoQu: {
        sou: '',
        xiaLa: '',
        nianJi: '',
        xueKe: '',
        zhuangTai: '',
        kongVal: '',
        security: '',  // 校园安全二级菜单
        geogr: '',  	 // 人文地理二级菜单
        day1: '',
      },
      theRadio: {},      // 单选中置灰
      url: '',
      isShowDisabledUp: false, // 控制按钮 开
      isShowDisabledDown: false, // 控制按钮 关
      srcList: [],
      isDisabled: true,
      pickerDay: '', // 选择搜索创建时间
      setMonthDisableds: {  // 自然年限制大于当前年不可选
        disabledDate(time) {
          return time.getTime() > Date.now() - 8.64e6
        }
      },
      loading: false,
      visible: false,
      chooseEsAt: {  // 排序弹框
        radioGroup: '理化生实验', // 默认的选择这俩
        disciplineSe: '物理',  // 学科
        mathematics: '数学',
        security: '地震逃生',
        geographic: '大美华夏',
        currentRow: null,
        currentId: [],  // 判断点击出来input
        currentIds: [],
        cancelBtn: false, // 再点击确定的时候置灰取消按钮
        autofocus: false, // input自动获取焦点
      },
      drag: false,
      myArray: [],  // 排序弹框显示的数组
		}
	},
  watch: {
    $route:{
      handler: function(val, oldVal){
        localStorage.removeItem("pageNumber");
        this.publicList();  // 返回页面后自动刷新
      },
      deep:  true // 深度观察监听
    },
    currentPage3: {
      handler: function(newVal, oldVal) {
        localStorage.setItem('pageNumber', newVal);
      },
      deep:  true // 深度观察监听
    },
    'huoQu.xiaLa': {
      handler: function(val, oldVal) {
        if(timestampToTime(new Date()).split(' ')[0] == timestampToTime(this.pickerDay).split(' ')[0]) {
          this.pickerDay = '';
          sessionStorage.removeItem("Today");
        } 
      }
    },
    myArray: {
      handler: function(newVal, oldVal) {
        this.myArray = newVal;
        // console.log(newVal, oldVal)
      }
    }
  },
  created(){
    
  },
	mounted() {
    var _this = this;   // console.log(this.$route.path)  console.log(sessionStorage.getItem('Today'))
    if(sessionStorage.getItem('Today')) {
      const newDate = timestampToTime(new Date()).split(' ')[0]; 
      this.$http.content.courseware({minDate: newDate,maxDate: newDate}).then( res => {
        this.formData = res.data;
        this.total = res.total;
        this.currentPage3 = res.currentPage;
        this.publicStudent();
        this.pickerDay = newDate;
      }).catch( res => { console.log(res) })
    } else { _this.publicList(); } //  获取列表
    // 为了防止火狐浏览器拖拽的时候以新标签打开
    document.body.ondrop = function (event) {
      event.preventDefault();
      event.stopPropagation();
    }
	},
	methods: {
    // 更改公共的累计学习时长h
    publicStudent(time) { this.formData.filter( item => { item.shi = timestampToTimeShi(item.shi) }) },
		// 搜索
		onSearch(data) {
			this.huoQu.sou = data;
			if (this.time) { clearTimeout(this.time); }
			this.time = setTimeout( async () => {
				this.currentPage3 = 1;
				await this.publicList(this.currentPage3,data,this.huoQu.xiaLa,this.huoQu.xueKe,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
			}, 500);
		},
		// 输入框清除按钮
		clearChange() {
			this.currentPage3 = 1;
			this.huoQu.sou  = '';
			this.publicList(this.currentPage3,'',this.huoQu.xiaLa,this.huoQu.xueKe,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
		},
		// 全部分类下拉框
		classification(val){
			if(val != '') {
				this.huoQu.xiaLa = val;
				if(this.huoQu.xiaLa == '数学几何') {  // 在这里判断一下选择数学几何的话就让学科给置空
					this.currentPage3 = 1;
					this.huoQu.xueKe = '';
					this.publicList(this.currentPage3,this.huoQu.sou,val,'',this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
				} else if(this.huoQu.xiaLa == '心理健康' || this.huoQu.xiaLa == '校园安全' || this.huoQu.xiaLa == '人文地理') {
					this.currentPage3 = 1;
					this.huoQu.xueKe = this.huoQu.nianJi = this.huoQu.security = this.huoQu.geogr = '';
					this.publicList(this.currentPage3,this.huoQu.sou,val,'','',this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
				} else {
					this.currentPage3 = 1;
					this.publicList(this.currentPage3,this.huoQu.sou,val,this.huoQu.xueKe,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
				}
			} else {  // 这个相当于清空/清除按钮分类下拉
				this.currentPage3 = 1;
				this.huoQu.xiaLa = this.huoQu.xueKe = '';
				this.publicList(this.currentPage3,this.huoQu.sou,'',this.huoQu.xueKe,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
			}
		},
		// 全部学科下拉
		nChange(val){
			this.huoQu.xueKe = val;
			if(val != '') {
				this.currentPage3 = 1;
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,val,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
			} else {
				this.currentPage3 = 1;
				this.huoQu.xueKe = '';
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,'',this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
			}
		},
		// 全部年级下拉
		jChange(val){
      const newVal = val.toString();
      this.huoQu.nianJi = val.toString();
			if(val != '') {
				this.currentPage3 = 1;
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,this.huoQu.xueKe,newVal,this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
			} else {
				this.currentPage3 = 1;
				this.huoQu.nianJi = '';
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,this.huoQu.xueKe,'',this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
			}
		},
		// 全部状态下拉
		onWrite(val){
			val = val == '已上架' ? '1' : val == '已下架' ? '2' : val == '未上架' ? '3' : '';
		  this.huoQu.zhuangTai = val;
			if(val != '') {
				this.currentPage3 = 1;
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,this.huoQu.xueKe,this.huoQu.nianJi,val,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
			} else {
				this.currentPage3 = 1;
				this.huoQu.zhuangTai = '';
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,this.huoQu.xueKe,this.huoQu.nianJi,'',this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
			}
		},
    // 校园安全
    nChangeSe(val){
      this.huoQu.security = val;
			if(val != '') { 
				this.currentPage3 = 1;
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,this.huoQu.xueKe,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security,this.huoQu.day1);
			} else {
				this.currentPage3 = 1;
				this.huoQu.security = '';
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,this.huoQu.xueKe,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security,this.huoQu.day1);
			}
    },
    // 人文地理
    nChangeReSr(val){
      this.huoQu.geogr = val;
			if(val != '') {
				this.currentPage3 = 1;
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,this.huoQu.xueKe,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.geogr,this.huoQu.day1);
			} else {
				this.currentPage3 = 1;
				this.huoQu.geogr = '';
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,this.huoQu.xueKe,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.geogr,this.huoQu.day1);
			}
    },
		// 选择时间
		changePickerDay(val){
		  this.huoQu.day1 = timestampToTime(val).split(' ')[0];
			if(val != null) {
				this.currentPage3 = 1;
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,this.huoQu.xueKe,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
			} else {
				this.currentPage3 = 1;
				this.huoQu.day1 = '';
				this.publicList(this.currentPage3,this.huoQu.sou,this.huoQu.xiaLa,this.huoQu.xueKe,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,'','');
			}
		},
    // 放大图片  先注释
    // imgTopBig(row){ this.url = row.img; this.srcList.push(row.img); },
    //  新增/上架/下架/删除操作
		operations(state){
      this.SelectionList.filter( item => {
        this.newId.push(item.id);
      })
      if(state == 'add') {
        const add = 'add';
        this.$router.push({ name: 'curriculum' })
        sessionStorage.setItem('add',add);
      }else if(state == 'shelves') {   //  上架
        this.$confirm('上架此商品, 是否继续?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' })
        .then(() => {
          this.$http.content.topShelves({ ide: this.newId.toString()}).then(res => {
            this.publicList();
            this.$message({
              type: 'success',
              message: '已成功上架该资源!'
            });
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消上架'
          });
        });
      } else if(state == 'xShelves') {  // 下架
        this.$confirm('下架此商品, 是否继续？', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' })
        .then(() => {
          this.$http.content.botShelves({ide: this.newId.toString()}).then( res => {
            this.publicList();
            this.$message({
              type: 'success',
              message: '已成功下架该资源!'
            });
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消下架'
          });
        });
      } else {   // 删除
        const newCont = this.findElem(this.SelectionList,'status', 1);
				if(newCont != -1) {
					this.$message({
						type: 'warning',
						message: '已上架的课件不能删除'
					});
				} else {
					this.$http.content.deleteListAll({ide: Array.from(new Set(this.newId)).toString()}).then( res => {
						this.publicList();
						this.$message({
							message: '删除成功',
							type: 'success'
						});
						this.currentPage3 = Number(localStorage.getItem("pageNumber")) || 1;
						this.handleCurrentChange(this.currentPage3);
					});
				}
      }
		},
    // ========================================================================================================================================
    // 排序弹窗中的排序
    theSorting(){ 
      this.visible = true; 
      this.chooseEsAt.cancelBtn = false;
      this.obtainSorting(this.chooseEsAt.radioGroup, '', this.chooseEsAt.disciplineSe); 
    },
    dblclick(eve){  // 排序弹窗中的鼠标的双击事件
      let double = this.myArray.filter( item => { if(eve == item.id) { return item; } })
      this.chooseEsAt.currentId = double;
    },
    blurChangeDb(eve,index) { // 排序弹窗中的input失去焦点触发
      if(eve > this.myArray.length) { 
        this.$message({ message: '输入值不允许超过列表数据个数，超过后系统自动矫正', type: 'warning' });
        this.myArray.map( (item,ind) => {
          if(index == ind) { item.sort = index + 1; } // 判断你输入的值是否大于该数组的长度如果大于该数组的长度话 就让序号重置为它的下标位置即可
        })
      }
      this.chooseEsAt.currentId = []; 
    },
    // handleCurrentChange(val) { this.chooseEsAt.currentRow = val; },
    onStart(e){ this.drag = true; },// 排序弹窗中的开始拖拽事件
    onEnd(e) { // 排序弹窗中的拖拽结束事件
      const _this = this;
      _this.drag = false;
      if(e.type == 'end') {
        _this.myArray.filter( (item, index) => { item.sort = index + 1; });
      }
    },
    mouseover(eve){ // 排序弹窗中的监听移入
      let double = this.myArray.filter( item => { if(eve == item.id) { return item; } })
      this.chooseEsAt.currentIds = double;
    },
    onChange(e) {  // 排序弹窗中的全部分类选择
      if(this.chooseEsAt.radioGroup == '理化生实验') {
        this.chooseEsAt.disciplineSe = '物理';
        this.obtainSorting(this.chooseEsAt.radioGroup, '', this.chooseEsAt.disciplineSe); 
      } else if(this.chooseEsAt.radioGroup == '数学几何') {
        this.obtainSorting(this.chooseEsAt.radioGroup, '', this.chooseEsAt.mathematics); 
      } else if(this.chooseEsAt.radioGroup == '心理健康') { 
        this.obtainSorting(this.chooseEsAt.radioGroup, '', '');
      } else if(this.chooseEsAt.radioGroup == '校园安全') {
        this.chooseEsAt.security = '地震逃生';
        this.obtainSorting(this.chooseEsAt.radioGroup, this.chooseEsAt.security, '');
      } else {
        this.chooseEsAt.geographic = '大美华夏';
        this.obtainSorting(this.chooseEsAt.radioGroup, this.chooseEsAt.geographic, '');
      }
    },
    disciplineSe(e) { // 排序弹窗中的学科disciplineSe选择
      if(this.chooseEsAt.radioGroup == '理化生实验' || this.chooseEsAt.radioGroup == '数学') {
        this.obtainSorting(this.chooseEsAt.radioGroup, '', this.chooseEsAt.disciplineSe);
      } else {
        this.obtainSorting(this.chooseEsAt.radioGroup, e.target.value, '');
      }
    },
    obtainSorting(fname, tname, subject) { // 课件弹窗排序请求数组接口方法
      this.$http.content.questSort({fname, tname, subject}).then( res => { this.myArray = res.data; })
    },
    handleOk() {  // 排序弹窗中的确定按钮
      const curArr = this.myArray.map( item => { return item.sort; }); 
      var nary = curArr.sort();  // 在循环之前先排序，然后再判断是否有相同的
      const nthNew = [];
      for(var i = 0; i < nary.length; i++) {
        if(Number(nary[i]) === Number(nary[i + 1])){
          nthNew.push(nary[i]);
        }
      }
      if(nthNew.length > 0) {
        this.$message({ message: '警告，请查看所选序号是否重复,如果重复请更改', type: 'warning' });
      } else {
        this.loading = true;
        this.chooseEsAt.cancelBtn = true;
        this.$http.content.sortingSave({sortUpdateLists: this.myArray}).then( res => {
          if(res.code == 200) {
            setTimeout(() => {
              this.chooseEsAt.radioGroup = '理化生实验';
              this.chooseEsAt.disciplineSe = '物理';
              this.visible = false;
              this.loading = false;
              this.$message({ message: '恭喜您，保存成功', type: 'success' });
            }, 1500);
          }
        })
      }
    },
    handleCancel(e) { this.visible = false;this.chooseEsAt.radioGroup = '理化生实验';this.chooseEsAt.disciplineSe = '物理';this.$message('已取消排序'); }, // 排序弹窗取消按钮
    //========================================================================================================================================
		// 判断全选 点击删除对应的数据  上面的删除调用
		findElem(array, attr, val) {
			for (var i = 0; i < array.length; i++) {
				if (array[i][attr] == val) {
					return i; //  返回当前索引值
				}
			}
			return -1;
		},
    // 单选
    selectChange(val) {
      this.theRadio = val;
      this.row.id = val.id; 
      this.row.status = val.status;
      // if(!this.SelectionList.includes(val)) { this.isDisabled = false; }// console.log(!this.SelectionList.includes(val));
      this.SelectionList.filter( item => {
        if(item.status == val.status) { this.isDisabled = false; } 
        else { this.isDisabled = true; }
      })
    },
		// 表格全选择按钮
    handleSelectionChange(val){ 
      this.SelectionList = val;
      if(this.SelectionList.length == this.formData.length) {
        this.theRadio = {};
      }
      this.SelectionList.filter( item => {
        if(item.status == 1) { this.isShowDisabledUp = false; }
        else if(item.status == 2){ this.isShowDisabledDown = false }
      })
    },// 
		// 表格的操作按钮
		operation(row , state) {
			if(state === 'details'){  //  详情
        sessionStorage.setItem('userData', JSON.stringify(row));
        this.$router.push({ name: 'details' });
			} else if(state == 'delete') {  // 删除
        if(row.status == 1) {
          this.$message({
            type: 'warning',
            message: '已上架的课件不能删除'
          });
        } else {
          this.$http.content.deleteList({id: row.id}).then( res => {
            this.publicList();
            this.$message({
              message: '该课件已成功删除',
              type: 'success'
            });
            this.currentPage3 = Number(localStorage.getItem("pageNumber")) || 1;
            this.handleCurrentChange(this.currentPage3);
          })
        }
      } else {  //  上下架
        if(state === '下架') {
          this.$http.content.upAndDown({id: row.id,status: 1}).then(res => {
            this.publicList();
            this.$message({
              message: '该课件已成功下架',
              type: 'success'
            });
          })
        } else {
          this.$http.content.upAndDown({id: row.id,status: 2}).then( res => {
            this.publicList();
            this.$message({
              message: '该课件已成功上架',
              type: 'success'
            });
          })
        }
      }
		},
    // 分页操作
		handleSizeChange(val) { this.currentPage3 = val; },
		handleCurrentChange(val) {
			this.currentPage3 = val;
      this.publicList(val,this.huoQu.sou,this.huoQu.xiaLa,this.huoQu.xueKe,this.huoQu.nianJi,this.huoQu.zhuangTai,this.huoQu.security || this.huoQu.geogr,this.huoQu.day1);
		},
    //  获取列表公共的请求接口
    publicList(val, sou, xiaLa, xueKe, nianJi ,zhuangTai, tname, minDate) {
      this.$http.content.courseware({page: val,name: sou,fname: xiaLa,subject: xueKe,clas: nianJi,status: zhuangTai,tname: tname,minDate: minDate,maxDate: minDate}).then( res => {
        this.formData = res.data;
        this.total = res.total;
        this.currentPage3 = res.currentPage;
        this.publicStudent();
      }).catch( res => {console.log(res)})
    },
	}
}
</script>

<style scoped>
@import '../../assets/css/content/contentSe.scss';
</style>